<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>会员资料</title>
		<script src="__INDEX__/js/mui.min.js"></script>
		<link href="__INDEX__/css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="__INDEX__/css/iconfont.css" />
		<link rel="stylesheet" href="__INDEX__/css/style.css" />
		<link rel="stylesheet" href="__INDEX__/css/mall.css" />
		<link rel="stylesheet" href="__INDEX__/css/LArea.css" />
	</head>
	<body onload="loadProvince()">
		<div class="mui-content ">
			{include file="public/member" /}
			<div class="glj_bt"><span class="mui-icon iconfont icon-dingdan4"></span><em style="padding-left: 20px;"> 我的设置</em></div>
			<div class="gerenzl_nr">
				<form id='my_form' class="mui-input-group gerenzl_group layui-form update_form">
					<div class="mui-input-row ">
						<label style="width: 23%;"><em>*</em>手机号</label>
						<label style="width: 2%;"><em>*</em></label>
						<input type="text" id="mobile" value="{$info_user['mobile']}" disabled="disabled" style="text-align: left;width: 30%;float: left;" class="mui-input-group" placeholder="请填写手机号码" lay-verify="required">
						<label style="width: 20%;">(已绑定)</label>
				</div>
					<div style="height:5px;background-color: #EFEFF4;"></div>
					<div class="mui-input-row ">
						<label style="width: 23%;">姓名</label>
						<label style="width: 2%;"><em>*</em></label>
						<input type="text" id="real_name" name="real_name" value="{$info_user['real_name']}" style="text-align: left;" class="mui-input-group" placeholder="请填写姓名" lay-verify="required">
					</div>
					<div class="mui-input-row">
						<label style="width: 23%;">微信号</label>
						<input type="text" id="wx_account" name="wx_account" value="{$info_user['wx_account']}" style="text-align: left;" class="mui-input-group" lay-verify="required" placeholder="请输入您的微信号">
					</div>
					<div class="mui-input-row">
						<label style="width: 23%;">身份证</label>
						<input type="text" id="idcard" name="idcard" value="{$info_user['idcard']}" style="text-align: left;" class="mui-input-group" lay-verify="required" placeholder="请输入您的身份证">
					</div>
					<div class="mui-input-row">
				      <label class="layui-form-label" style="width: 23%;text-align: left;">出生日期</label>
				      <div class="layui-input-inline">
				        <input type="text" class="layui-input" {if $info_user.birthday} value="{$info_user.birthday}"{/if} name="birthday"  id="test5" placeholder="yyyy-MM-dd" style="text-align: left;">
				      </div>
				    </div>
				    <div class="layui-form-item address mui-input-row">
						<label class="layui-form-label " style="width: 18%;text-align: left;">所在城市</label>
						<input type="hidden" name="city" id='city' value="{$info_user.city}">
						<input type="hidden" name="province" id='province' value="{$info_user.province}">
						<select lay-ignore     id="proS" onchange="loadCity()"  style="margin-left: 10px;width: 25%;float: unset;">
						  <option value="" >{$info_user.province|default='请选择省份'}</option>
						</select> 
						<select lay-ignore     id="cityS" style="width: 25%;float: unset;">
						  <option value="">{$info_user.city|default='请选择城市'}</option>
						</select> 
					</div>
					<div class="gerzl_btn" style="position: relative; text-align: center; line-height: 45px; height: 50px;">
						<button type="button" lay-submit lay-filter="submit_form" class="layui-btn" style="background: #1ed925;width: 100%;">保存</button>
					</div>
				</form>
			</div>
		</div>
	</body>

</html>
{include file="public/footer" /}
<script type="text/javascript" src="__PUBLIC__/static/js/pro.js"></script>
<script async type="text/javascript" src="__PUBLIC__/static/js/city.js"></script>
<script>
	//提交表单
	function set_content() {
		var nickname=$("#real_name").val();
		var phone = $("#mobile").val();
		if(nickname == '') {
			layer.msg('姓名不能为空');
			onoff = true;
			return;
		}
		/*if(phone == '') {
			layer.msg('手机号码不能为空');
			onoff = true;
			return;
		}*/
		/*var reg = /^1[3|4|5|6|7|8][0-9]{9}$/; //验证规则
		if(!reg.test(phone)) {
			layer.msg('手机号码格式不正确');
			onoff = true;
			return;
		}*/
		
		var province_tilte = $("#proS").find("option:selected").text(); 
		$('#province').val(province_tilte);
		
		var city_tilte = $("#cityS").find("option:selected").text(); 
		$('#city').val(city_tilte);
		
		$.ajax({
			type: "post",
			url: "{:url('member/member')}",
			data: $('#my_form').serialize(), //表单数据
			success: function(data) {
				layer.msg(data.msg, {
					icon: 1,
					time: 1500 //2秒关闭（如果不配置，默认是3秒）
				}, function() {
					//location.href='index.html';
				});
			}
		});

	}
</script>
<script>
	//图片上传
	layui.use(['form', 'upload','laydate'], function() {
		var $ = layui.jquery,
			upload = layui.upload,
			laydate = layui.laydate,
			form = layui.form;
			
		laydate.render({
		    elem: '#test5'
		});
		
		
		//监听提交
		  form.on('submit(submit_form)', function(data){
		   set_content();
		    return false;
		  });
		
		
	})
</script>
<script type="text/javascript">
			var proS=document.getElementById("proS"),cityS=document.getElementById("cityS");
			function loadProvince(){
				var tempFragment = document.createDocumentFragment();
				for(var i=0;i<proData_.length;i++){
					var option=document.createElement("option");
					option.setAttribute("value",proData_[i].pk);
					option.setAttribute("calss",'layui-select-title');
					option.innerHTML=proData_[i].pv;
					tempFragment.appendChild(option);
				}
				//使用dom碎片，减少对dom的重复操作
				proS.appendChild(tempFragment);
			}
			function loadCity(){
				if(proS.value==0){
					return;
				}else{
					cityS.innerHTML="<option value='0'>请选择</option>";
					var hasFound=false;
					var tempFragment = document.createDocumentFragment();
					for(var i=0;i<cityData_.length;i++){
						if(proS.value==cityData_[i].pk){
							hasFound=true;
							var option=document.createElement("option");
							option.setAttribute("value",cityData_[i].ck);
							option.setAttribute("calss",'layui-select-title');
							option.innerHTML=cityData_[i].cv;
							tempFragment.appendChild(option);
							
						}else{
							//需要查找的数据都是放一块的，如果匹配过，又出现不匹配，那么之后数据肯定都是不匹配的。可以pass掉，减少循环次数
							if(hasFound){
								break;
							}
						}
					}
					cityS.appendChild(tempFragment);
				}
			}
</script>
